<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="static/js/jquery.min.js"></script>
    <script type="text/javascript"
            src="static/js/bootstrap/js/bootstrap.min.js"></script>
    <link rel="stylesheet"
          href="static/js/bootstrap/css/bootstrap.min.css" />
    <link rel="stylesheet"
          href="static/js/bootstrap/css/bootstrap-treeview.min.css"
    >
    <script src="static/js/bootstrap/js/bootstrap-treeview.min.js"></script>
    <link rel="stylesheet"
          href="static/js/bootstrap/css/bootstrap.addtabs.css">
    <script src="static/js/bootstrap/js/bootstrap.addtabs.min.js"></script>
    <link rel="stylesheet" href="static//js/bootstrap/css/bootstrap-table.min.css">
    <script src="static/js/bootstrap/js/bootstrap-table.min.js"></script>
    <script src="static/js/bootstrap/js/bootstrap-table-zh-CN.min.js"></script>
    <script src="static/js/bootstrap/js/bootbox.js"></script>
    <link rel="stylesheet"
          href="static/js/bootstrap/css/bootstrap-datetimepicker.min.css" />
    <script type="text/javascript"
            src="static/js/bootstrap/js/bootstrap-datetimepicker.min.js"></script>
    <script type="text/javascript"
            src="static/js/bootstrap/js/bootstrap-datetimepicker.zh-CN.js"></script>
    <script src="static/js/bootstrap-fileinput/js/fileinput.js"></script>
    <script src="static/js/bootstrap-fileinput/js/locales/zh.js"></script>
    <link rel="stylesheet" href="static/js/bootstrap-fileinput/css/fileinput.css">
</head>
<body>

<div class="container-fluid">
    <!-- 	导航栏 -->
    <nav class="navbar navbar-inverse">
        <div class="container" style="height: 100px">
            <div class="navbar-header" >
                <label id="userid" th:text="${user.userId}"></label>
                <label id="userRealName" th:text="${user.userRealName}"></label>
                <a class="navbar-brand"  style="font-size: 30px" href="#">欢迎使用阳光e购定制比价网</a>
            </div>
        </div>
    </nav>
    <div class="row" >
        <div class="col-md-2" style="color: #2aabd2">
            <ul id="myTree"></ul>
        </div>
        <div class="col-md-9">
            <div id="myTabs">
                <!-- 新选项卡 -->
                <ul class="nav nav-tabs" id="tablist" >
                    <li role="presentation" class="active" >
                        <a href="#home" role="tab" data-toggle="tab">欢迎</a>
                    </li>
                </ul>

                <!-- 选项卡下内容 -->
                <div class="tab-content" >
                    <div role="tabpanel" class="tab-pane active" id="home">
                        <!-- <img width="100%" height="100%" src="1.jpg"> -->
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript">
    $(function(){
        getTree();
    })
    /* 获取树 */
    function getTree(){
        $.ajax({
            url:"getTree?pid=0",
            success:function(data){
                $("#myTree").treeview({
                    data:data,
                    onNodeSelected:function(event, node){
                        console.log(node.text);
                        console.log(document.body.clientHeight);
                        var pm = document.body.clientHeight;
                        $.addtabs({iframeHeight:1000})
                        $.addtabs.add({
                            id:node.id,
                            title:node.text,
                            url:node.href,
                        })
                    }
                })
            }
        })
    }

</script>
</html>
</html>